<template>
  <div class="blog-m-app">
    <MHeader />

    <div class="blog-m--container">
      <transition
        mode="out-in"
        appear
        enter-active-class=" animate__animated animate__fadeInRight"
      >
        <router-view></router-view>
      </transition>
    </div>
    <MFootBar />
    <MUserLogin />
  </div>
</template>

<script>
import MFootBar from "./MFootbar";
import MHeader from "./MHeader";
import MUserLogin from '@/components/m/MBaseUserLogin'
export default {
  name: "VueEleMHomes",
  components: {
    MFootBar,
    MHeader,
    MUserLogin
  },
  data() {
    return {};
  },
  created() {
    //渲染移动端, 如果存在token, 就获取userInfo
    if (this.$store.state.user.token && !this.$store.state.user.userInfo._id) {
      this.$store.dispatch('user/getUserInfo')
    }
  },
  mounted() {},

  methods: {},
};
</script>
<style lang="stylus" 
>
.blog-m--container {
  height: calc(100vh - 105px);
  overflow: hidden;
  overflow-y: auto;
  background-color: #f1f1f1;
}

.animate__fadeInRight {
  --animate-duration: 0.5s;
}
</style>